<template>
	<div id="content">
		<Header />
		<div class="bread">
			<div class="cont w1200">
				<img src="../../../assets/img/location.png" alt=""><a><router-link
						to="/portal/index">首页</router-link></a> > <a><router-link
						to="/portal/net">网谷里</router-link></a>><a>代表履职</a>
				<a href="" class="back"><img src="../../../assets/img/back.png" alt=""><router-link
						to="/portal/net">返回上一级</router-link></a>
			</div>
		</div>
		<div class="inner">
			<div class="net w1200">
				<h3>代表履职</h3>
				<div class="form">
					<div class="form-left">
						<div class="btnL">
							<img src="../../../assets/img/left-bar1-hover.png" alt="">
							<img src="../../../assets/img/left-bar1.png" alt=""><router-link
								to="/portal/net/repreWorkAdd">新建纪实</router-link>
						</div>
						<div class="btnL active">
							<img src="../../../assets/img/left-bar2-hover.png" alt="">
							<img src="../../../assets/img/left-bar2.png" alt=""><router-link
								to="/portal/net/repreWork">历史纪实</router-link>
						</div>
					</div>
					<div class="form-right">
						<div class="title bob">
							<div class="line"></div>历史纪实
							<div class="add-btn"><router-link to="/portal/net/repreWorkAdd">+新建纪实</router-link></div>
						</div>
						<div class="form-detail">
							<div class="history1">
								<div class="item">
									<select v-model="startDate" @change="selectDate">
										<option value="2024">2024年</option>
										<option value="2023">2023年</option>
										<option value="2022">2022年</option>
										<option value="2021">2021年</option>
										<option value="2020">2020年</option>
										<option value="2019">2019年</option>
									</select>
								</div>
								<div class="item">
									履职次数
									<div class="times">
										{{ total }}
									</div>
								</div>
							</div>
							<div class="history2">
								<div class="history-detail" v-for="item in List">
									<div class="operate">
										<div class="left">
											<div class="dot"></div>
											<span>{{ item.startDate }}</span>
											<span>履职标题：{{ item.title }}</span>
											<span>履职地点：{{ item.location }}</span>
										</div>
										<div class="right">
											<div class="red">{{ item.reviewStatus }}</div>
											<!--											<div class="delete"><img src="../../../assets/img/delete.png" alt="">删除-->
											<!--											</div>-->
										</div>
									</div>
									<div class="border">
										<p v-html="item.description"></p>
										<div class="file-list" v-if="item.imagePath">
											<div class="img">
												<img :src="item.imagePath" alt="">
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<div class="page">
							<pagination v-show="total > 0" :total="total" :page.sync="pageNum" :limit.sync="pageSize"
								@pagination="getlist" />
						</div>
					</div>
				</div>
			</div>
		</div>
		<Contact />
	</div>

</template>

<script>
import Header from '@/components/Header';
import Contact from '@/components/Contact';
import { getRepWorkList } from "@/api/website";
export default {
	data() {
		return {
			List: {},
			userInfo: {},
			total: 0,
			pageNum: 1,
			pageSize: 10,
			startDate: "2024"
		}
	},
	components: {
		Header,
		Contact
	},
	created() {
		this.userInfo = JSON.parse(sessionStorage.getItem("useInfo"))
		this.getlist(this.userInfo.id,this.date)
	},
	mounted() {

	},
	methods: {
		getlist(id, date) {
			getRepWorkList({ id: id, date: date, pageNum: this.pageNum, pageSize: this.pageSize }).then(response => {
				this.List = response.rows;
				this.total = response.total
			});
		},
		selectDate() {
			this.getlist(this.userInfo.id, this.startDate)
		}
	}

};
</script>

<style scoped lang="scss"></style>
